UX Critique, Apple Music Replay 2022
Today, when I opened Apple Music on my Mac, I noticed a banner with the text “Replay 2022”. It’s an experience similar to Spotify Wrapped. Actually, the first time I opened the Music app, it crashed. When I re-opened it, I saw the banner. I was curious and clicked on it, starting an experience that prompted me to write this post.
Usually, when you click on one of the big banners in Apple Music, it opens that page inside the app, or if you click on the play button in the bottom left corner, it starts playing music. I absentmindedly clicked in the bottom left corner, looking forward to a replay of my 2022 listening habits. What I expected was music, but what I got was a bad surprise.
To Apple’s credit, the banner has a small label at the bottom, indicating it will open a page outside the app. But Apple should know better. When scanning the banners, the small indicator is one of the last things you notice. The concept of Visual Hierarchy is one of the fundamental principles of design and it was ignored here.
Let’s move on. Once you’ve gotten over the surprise that Apple just kicked you out of their Music app, you’ll realize that what you’re looking at is Apple Music in the browser. Unfortunately, the view greeting you is most likely the generic Apple Music web app because you’re unlikely to be signed in. The whole page needs to make more sense. All that should be visible at this point is the “Log In” button, but it’s tucked into the top right corner.
If you’re like me, and you’re not always in your home country, you will be familiar with websites assuming the correct language for you is the language of wherever you happen to be. Same here: The Apple Music Web App will open in the country’s language you’re in, not the language you set up your Mac to use. And as the cherry on top, if you configured Safari to have the tabs on top, the web app looks visually appalling.
Safari uses the violet background of the web app to color its UI. I actually like the violet they chose; it’s a nice one, but the music web app has an off-white bar at the top, leading to a jarring disconnected, and chaotic look, especially when you consider the neon-pink bar at the bottom telling you to subscribe.
Clicking on the “Log In” button, what would you expect? I expected a dialog allowing me to log in with my Apple ID. What appeared was a rounded white rectangle. I waited a bit longer. After a few more seconds, a system dialog appeared. It was formatted in a way that made reading its content impossible, but at least the button I needed to click was not out of reach. On my second try, the dialog expanded fully, and I could actually see the full content of the login overlay:
Once you click the button to sign in using a password, another system dialog opens on top of the first, asking you to enter your password. The dialog asks for the password you use to sign into your Mac. I’ve had people call me on the phone, desperate because they were stuck trying to sign in using their Apple ID password or another password. They needed help figuring out what password to use. This method of signing in needs to be clarified, and it could be much more user-friendly.
Back to the task at hand — I got here trying to access the Apple Music Replay 2022, and so far, I have managed to sign in. The problem I’m facing now is that the Apple Music web app is in Dutch because I am visiting the Netherlands. I don’t speak Dutch, and there is no obvious way to change the language, so far as I can tell. What’s frustrating me is this: Why is it in Dutch in the first place? I set up my Mac to use German, registered my Apple ID using a German address and credit card, and the web app should use either info to open in the correct language — now that I’m signed in.
I couldn’t find any way to switch the language of the Apple Music web app, and after a bit of searching around, I decided to click on my profile picture in the top right of the window. An iOS-style menu opened — reminder: I’m using a desktop Mac to document this experience. One of the menu items is “Instellingen”, which is very close to the German word for settings (“Einstellungen”), so I clicked it. For a brief second, I could see my account info and a headline announcing “Account Settings” — first in English, and then it switched to German. But alas, the dreaded login dialog is back, and the app hid the settings again. Why do I have to sign in again? Why did I see my personal information on a website before signing in? Also, this time the login dialog is broken — again:
By the way, every time the login dialog appears, all open Finder windows move to my first desktop and switch to their first open tab, but at this point, that is the least of my concerns.
I signed in and had a good laugh. The web app itself was still in Dutch, but the Account Settings were in German — except for the footer, which was in Dutch, English, and German. Also, the account settings won’t help me set the web app to German, but they do contain a link to set the settings to Dutch or English — not helpful.
In the screenshot, the left sidebar (annotation “1”), the links to other pages (6 and 3) are in Dutch, the content of the settings is in German (2), and the copyright notice is partly in English (4) and partly in German (5). At this point, I’m pretty sure most people would have just closed the tab and moved on, but I decided to press on, but this is turning out to be a funny blog post. Why stop?
Sitrep: I want to see the Apple Music Replay 2022 page in German or English; I’m looking at the Apple Music web app settings in several languages at once.
After a few seconds, I decided to reset. I signed in, so let’s find out what happens if I close the tab, and click on the banner in Apple Music again!
Would you believe it? It worked! The web app even figured out that it should load in German and opened flawlessly. Mind you, it still looks… you know… appalling. With the violet-themed Safari (yes, I still like the violet after 20 minutes) and the white music bar above the violet page, Apple seems to be going for the chaos aesthetic. Well done, Apple, you nailed it! Also, at the bottom, it now asks me if I want to switch to the Dutch version. Oh, well… moving on, let’s experience this Replay!
I closed the gray banner asking me if I wanted to switch to Dutch and clicked on “First Steps” (German: “Erste Schritte”). The “Highlight Reel” was nice. You can play a video/animation that looks like an Instagram reel and contains some of your favorite songs and some nice animations. You can also scroll through a visually appealing infographic/top-ten list of your listening habits. Of course, being made up of your favorite songs, you’ll probably enjoy it. It still looks odd that the Safari UI changes color, and the off-white bar between the content and Safari stays white.
The copied Instagram experience is complete with the click-and-hold to pause, release to resume, click on the right to skip ahead, or on the left to go back. I like that they didn’t try to reinvent the wheel, and (link: https://lawsofux.com/jakobs-law/ text: it’s also good UX that they didn’t. target: _blank) You know what’s bad UX? The desktop version of the Replay does not allow you to share it. The first time you open it, a banner informs you explicitly that you have to open the page on mobile to be able to share it.
Switching to my iPhone
I was greeted by a notification that my Replay 2022 was ready, so I tapped it. Safari opened, and I was already signed in. Cool! Generally, the mobile experience is the same — optimized for the smaller viewport size, of course.[1] Overall really nice, my iPhone also immediately captured my AirPods to play the music. I was finally enjoying this!
On the bottom right, the web app shows a tiny share button. The whole reason I switched from my Mac to my phone was to share this, so I tapped that icon. It’s a small black hairline icon on dark gray background, which looks like it could be impossible to make out for people with less than optimal eyesight. It also seems out of place, like it wasn’t designed to be shown in this context. Anyways: Guess what happens when you tap that dark circle meant to be a share button? Really take a moment and imagine what you’d expect to happen.
Sharing the Replay 2022
What did you come up with? I expected a short movie to share with friends or a multi-media share containing an image and a link. I got the iOS share dialog with one single still image, a PNG, while the animation and music kept playing in the background. What. The. Actual…? Are you for real, Apple?
I searched around a bit in the replay experience, and from what I could find, you cannot share any one of the beautiful animations — you can’t export them. You can’t even export a movie without the music! Copyright being what it is, exporting a silent movie would have made sense to me.
As the Replay is in Instagram’s design, I figured it should be easy to share there. I think this animated experience would be perfect for sharing on Instagram or TikTok. I wouldn’t mind adding the music using the Instagram editor, but you can’t re-create the experience on Instagram with the assets you get from the share button. The Replay experience is fun animations and music, and what you get when you tap share is a still image, a PNG, and no link to share. Apple really dropped the ball here — think of the marketing potential Apple left on the table this way! How many people would have posted links to their Replay on social media if it were possible? I bet millions.
Screen Recording
If I want to share my experience, I have to make a screen recording of the Apple Music Replay 2022 experience in Safari. And because I don’t get a link from Apple to share with my friends, all they see is the screen recording that illegally contains the music and doesn’t include a call-to-action to sign up for Apple Music.
Here is my screen recording — without sound. Unfortunately, it doesn’t reflect my taste because sometime this summer, my Apple Music completely reset and deleted all my listening history and playlists from several years, and I had to start from scratch.
Thank you for reading! If you’ve made it this far, I’m impressed. And since you care, I want to take a moment to acknowledge how technologically impressive this whole thing is, despite its flaws. The animations and web app use colors from the album artwork. The music Apple shows you in the Replay is not just your most played. It also contains some music you listened to less frequently but indicated you liked — for example, albums you listened to on repeat. I wish Apple hadn’t dropped the ball on UX testing this experience before publishing it.
The viewport is the area of a device's display which is used to show content. For websites it's the part that is white when you open a new tab and enter this URL into the address-bar: about:blank (yes, the address is two words separated by a colon, it's not a normal address). ↩︎